﻿@namespace BootstrapBlazor.Components
@inherits BootstrapComponentBase

<div class="scanner" @ref="@ScannerElement" data-autostop="@AutoStopString" data-scan="@ScanType">
    @if (ScanType == ScanType.Camera)
    {
        <div class="row g-3">
            <div class="col-12">
                <div class="scanner-buttons btn-group">
                    <Button data-method="scan" Color="Color.Primary" Text="@ButtonScanText" IsDisabled="@IsDisabled"></Button>
                    <Button data-method="close" Color="Color.Danger" Text="@ButtonStopText" IsDisabled="@IsDisabled"></Button>
                </div>

                <Checkbox DisplayText="@AutoStopText" ShowAfterLabel="true" @bind-Value="@AutoStop" class="mt-3" />
            </div>
            <div class="col-12 scanner-devices">
                <Select TValue="string" Items="@Devices" DisplayText="@DeviceLabel" OnSelectedItemChanged="OnSelectedItemChanged" ShowLabel="true" placeholder="@InitDevicesString" />
            </div>
            <div class="col-12 scanner-video">
                <video id="@GetHashCode()"></video>
            </div>
        </div>

    }
    else
    {
        <div class="scanner-buttons">
            <Button data-method="scanImage" Color="Color.Primary" Text="@ButtonScanText"></Button>
            <img class="scanner-image" />
        </div>
    }
</div>
